<!DOCTYPE html>
<html
        xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:th="http://www.thymeleaf.org"
        layout:decorate="~{base/layout}">
<div layout:fragment="content">
    <!--header wrapper end-->
    <!--med_tittle_section-->
    <div class="med_tittle_section">
        <div class="med_img_overlay"></div>
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="med_tittle_cont_wrapper">
                        <div class="med_tittle_cont">
                            <ol class="breadcrumb">
                                <li><a th:href="@{/}">仙庵城事</a></li>
                                <li>乡镇建筑</li>
                                <li>详情</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- med_tittle_section End -->
    <!--service section start-->
    <div class="page-container">
        <div class="container">
            <div class="row med_toppadder50 med_bottompadder50">
                <div class="col-lg-9 col-md-9 col-sm-8 col-xs-12">
                    <div class="news-detail-box">
                        <h3 th:text="${attractionsBuilding.name}"></h3>
                        <div class="author-info">
                            <span th:text="${#calendars.format(attractionsBuilding.updateTime,'yyyy-MM-dd')}"></span>
                            <span>所在地：<span th:text="${attractionsBuilding.address}"></span></span>
                            <span>浏览次数：13</span>
                        </div>
                        <div class="news-detail-content">
                            <div  class="img-div" style="text-align: center">
                                <img th:src="@{'/images/'+ ${attractionsBuilding.image} +'.jpg'}">
                            </div>
                            <p class="buildingStyle" id="editorContent" style="font-size: 18px;line-height: 30px;" th:text="${attractionsBuilding.describe}">
                            </p>
<!--                            <div align="right" style="float:right">-->
<!--                                <button th:if="${flag == false}" th:onclick="cancelAttractionsReserve([[${attractionsBuilding.id}]],'预订')"-->
<!--                                        type="button" class="btn btn-default btn-info">预订-->
<!--                                </button>-->
<!--                                <button th:if="${flag == true }" th:onclick="cancelAttractionsReserve([[${attractionsBuilding.id}]],'取消预订')"-->
<!--                                        type="button" class="btn btn-default btn-info">-->
<!--                                    取消预订-->
<!--                                </button>-->
<!--                            </div>-->
                        </div>
                    </div>

                </div>
                <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                    <div class="sider-card">
                        <div class="sider-card-header">
                            <h3>热门海景</h3>
                        </div>
                        <ul class="sider-list-model-a">
                            <li th:each="waterscape:${top10Waterscape}">
                                <a th:href="@{/attractions/waterscapeDetailsUI(id=${waterscape.id})}" th:text="${waterscape.name}"></a>
                            </li>
                        </ul>
                    </div>
<!--                    <div class="sider-card">-->
<!--                        <div class="sider-card-header">-->
<!--                            <h3>热门酒店</h3>-->
<!--                        </div>-->
<!--                        <ul class="sider-list-model-b">-->
<!--                            <li th:each="hotel:${top10Hotel}">-->
<!--                                <a th:href="@{/reserve/hotelDetailsUI(id=${hotel.id})}" th:text="${hotel.name}"></a>-->
<!--                            </li>-->
<!--                        </ul>-->
<!--                    </div>-->
                </div>

            </div>
        </div>
    </div>
    <!--service section end-->
    <script th:src="@{/js/jquery_min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/wow.min.js}"></script>
    <script th:src="@{/js/custom.js}"></script>
    <script th:src="@{/plugins/slider-pro/js/jquery.sliderPro.min.js}"></script>
    <script th:src="@{/plugins/owlcarousel/js/owl.carousel.min.js}"></script>
    <script th:src="@{/layer/layer.js}"></script>
    <script th:inline="javascript">
        window.onload = function (){
            $("#editorContent").html($("#editorContent").text());
            console.log($("#editorContent").text());
        }
        function cancelAttractionsReserve(id, str) {
            $.ajax({
                url: '/travel/reserve/cancelAttractionsReserve',
                data: {"id": id},
                type: 'post',
                dataType: 'json',
                success: function (result) {
                    if (result.code === 200) {
                        if(str == '预订'){
                            confirm(str + "成功!"); //在页面上弹出对话框
                            window.location.href = "/travel/reserve/reserveManageUI";
                        }else{
                            confirm(str + "成功!"); //在页面上弹出对话框
                            window.location.href = "/travel/reserve/reserveAttractionsListUI";
                        }
                    } else {
                        layer.open({
                            title: '错误提示',
                            content: result.message
                        });
                    }
                }
            })
        }
    </script>
</div>

</html>
